<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0" />
		<title>Document</title>
	</head>

	<body>
		<!-- 主体 -->
		<main>
			<!-- bnner -->
			<div id="banner" class="container">
				<div class="swiper">
					<div class="swiper-wrapper">
						<div class="swiper-slide slider1"></div>
						<div class="swiper-slide slider2"></div>
						<div class="swiper-slide slider3"></div>
					</div>
					<div class="swiper-pagination"></div>
				</div>
			</div>
			<div id="main">
				<div class="flex-c-sb">
					<div id="main-one" class="rel">
						<span class="iconfont icon-jiangbei abs"></span>
						<p class="abs fz-14 fc-wb">今日排名</p>
						<h1 class="fc-white abs">9</h1>
					</div>
					<div id="main-two" class="rel">
						<span class="iconfont icon-jihuarenwu abs"></span>
						<p class="abs fz-14 fc-wb">累计打卡<b>23</b>天</p>
						<button class="abs fz-14">今日打卡</button>
					</div>
				</div>
				<div class="flex-c-sb">
					<div id="main-three" class="rel">
						<p class="abs fc-white">运动数据</p>
					</div>
					<div id="main-four" class="rel">
						<span class="iconfont icon-badge abs"></span>
						<p class="abs fz-14 fc-wb">累计运动勋章</p>
						<h2 class="abs"><i>3</i><span class="fz-16">枚</span></h2>
					</div>
				</div>
				<div id="main-five" class="rel">
					<p class="abs fc-white">课程训练</p>
				</div>
				<div id="main-six" class="rel">
					<p class="abs fc-white">户外跑步</p>
				</div>
				<div id="main-seven" class="rel">
					<p class="abs fc-white">室内训练</p>
				</div>
			</div>
		</main>

		<!-- 尾部 -->
		<nav id="tabBar" class="flex-c-se"></nav>
	</body>
</html>
